<template>
  <view class="container">
    <div class="card_item" v-for="(item, index) in list" :key="index">
      <div style="display: flex; justify-content: space-between">
        <div class="card_item_orderNo">{{ item.deviceId }}</div>
        <div class="card_item_title">电量：{{ item.light }}</div>
      </div>

      <div class="card_item_title" style="margin-top: 20rpx">
        儿科病房医疗综合楼9楼
      </div>
    </div>
  </view>
</template>

<script>
export default {
  data() {
    return {
      list: [
        {
          // 设备号
          deviceId: "SN564564654",
          // 位置
          lcoation: "儿科8楼",
          // 电量
          light: 10,
        },
      ],
    };
  },

  /**
   * 生命周期函数--监听页面加载
   */
  async onLoad(options) {},

  methods: {},
};
</script>

<style lang="scss" scoped>
.container {
  min-height: 100vh;
  background: #f4f4f4;
  padding: 30rpx;
}

.card_item {
  height: 150rpx;
  line-height: 40rpx;
  border-radius: 24rpx;
  background-color: rgba(255, 255, 255, 1);
  color: rgba(16, 16, 16, 1);
  font-size: 28rpx;
  text-align: center;
  font-family: PingFangSC-regular;

  padding: 20rpx 30rpx;
}

.card_item_orderNo {
  color: rgba(255, 72, 72, 1);
  font-size: 32rpx;
  text-align: left;
  font-family: PingFangSC-regular;
}

.card_item_title {
  color: rgba(16, 16, 16, 1);
  font-size: 32rpx;
  text-align: left;
  font-family: PingFangSC-regular;
}
</style>
